<template>
  <div class="app-container">
    <!-- <div>
      <el-link href="" type="primary">平台使用方法.doc</el-link><br>
      <el-link href="" type="primary">体质测试标准.xls</el-link><br>
      <el-link href="" type="primary">体测数据格式标准.xls</el-link><br>
    </div> -->
    <el-table
      v-loading="listLoading"
      :data="list"
      element-loading-text="Loading"
      border
      fit
      highlight-current-row
    >
      <el-table-column align="center" label="序号" width="70">
        <template slot-scope="scope">
          {{ scope.$index }}
        </template>
      </el-table-column>
      <el-table-column label="名称" width="110" align="center">
        <template slot-scope="scope">
          <span>{{ scope.row.name }}</span>
        </template>
      </el-table-column>
      <el-table-column label="描述">
        <template slot-scope="scope">
          {{ scope.row.description }}
        </template>
      </el-table-column>
      <el-table-column align="center" prop="created_at" label="截止时间" width="200">
        <template slot-scope="scope">
          <i class="el-icon-time" />
          <span>{{ scope.row.end_date }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" prop="created_at" label="操作" width="200">
        <template slot-scope="{row}">
          <el-button type="text" @click="navigate(row)">查看</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import * as task from '@/api/task'
export default {

  data() {
    return {
      list: null,
      listLoading: true
    }
  },
  created() {
    this.fetchData()
  },
  methods: {
    fetchData() {
      this.listLoading = true
      task.teacher().then(response => {
        this.list = response.data
        console.log(this.list)
        this.listLoading = false
      })
    },
    navigate(task) {
      localStorage.task = JSON.stringify(task)
      this.$router.push('./index')
    }
  }
}
</script>
<style scoped>
</style>
